// statefulWidget 示例

import 'package:flutter/material.dart';

/// StatefulWidget 示例
/// 展示了状态管理、生命周期等常用功能
class MyStatefulWidgetDemo extends StatefulWidget {
  const MyStatefulWidgetDemo({super.key});

  @override
  State<MyStatefulWidgetDemo> createState() => _MyStatefulWidgetDemoState();
}

class _MyStatefulWidgetDemoState extends State<MyStatefulWidgetDemo> {
  // 状态变量
  int _counter = 0;
  bool _isVisible = true;
  double _sliderValue = 0.5;
  Color _backgroundColor = Colors.blue;

  // 生命周期方法示例
  @override
  void initState() {
    super.initState();
    print('StatefulWidget - initState');
    // 初始化操作
  }

  @override
  void dispose() {
    print('StatefulWidget - dispose');
    // 清理操作
    super.dispose();
  }

  // 更新状态的方法
  void _incrementCounter() {
    setState(() {
      _counter++;
    });
  }

  void _toggleVisibility() {
    setState(() {
      _isVisible = !_isVisible;
    });
  }

  void _updateSliderValue(double value) {
    setState(() {
      _sliderValue = value;
      // 根据滑块值改变背景颜色的透明度
      _backgroundColor = Colors.blue.withOpacity(value);
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('StatefulWidget Demo'),
        backgroundColor: Colors.blue,
      ),
      body: Container(
        color: _backgroundColor.withOpacity(0.1),
        child: Padding(
          padding: const EdgeInsets.all(16.0),
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              // 1. 计数器显示
              Card(
                elevation: 5,
                child: Padding(
                  padding: const EdgeInsets.all(16.0),
                  child: Column(
                    children: [
                      const Text(
                        '计数器示例',
                        style: TextStyle(
                          fontSize: 20,
                          fontWeight: FontWeight.bold,
                        ),
                      ),
                      const SizedBox(height: 10),
                      Text(
                        '当前计数: $_counter',
                        style: const TextStyle(fontSize: 24),
                      ),
                      const SizedBox(height: 10),
                      Row(
                        mainAxisAlignment: MainAxisAlignment.center,
                        children: [
                          ElevatedButton(
                            onPressed: _incrementCounter,
                            child: const Text('增加'),
                          ),
                          const SizedBox(width: 10),
                          ElevatedButton(
                            onPressed: () {
                              setState(() {
                                _counter = 0;
                              });
                            },
                            child: const Text('重置'),
                          ),
                        ],
                      ),
                    ],
                  ),
                ),
              ),
              const SizedBox(height: 20),

              // 2. 可见性控制
              Card(
                elevation: 5,
                child: Padding(
                  padding: const EdgeInsets.all(16.0),
                  child: Column(
                    children: [
                      const Text(
                        '可见性控制示例',
                        style: TextStyle(
                          fontSize: 20,
                          fontWeight: FontWeight.bold,
                        ),
                      ),
                      const SizedBox(height: 10),
                      if (_isVisible)
                        const FlutterLogo(size: 50)
                      else
                        const SizedBox(height: 50),
                      const SizedBox(height: 10),
                      ElevatedButton(
                        onPressed: _toggleVisibility,
                        child: Text(_isVisible ? '隐藏' : '显示'),
                      ),
                    ],
                  ),
                ),
              ),
              const SizedBox(height: 20),

              // 3. 滑块控制
              Card(
                elevation: 5,
                child: Padding(
                  padding: const EdgeInsets.all(16.0),
                  child: Column(
                    children: [
                      const Text(
                        '滑块控制示例',
                        style: TextStyle(
                          fontSize: 20,
                          fontWeight: FontWeight.bold,
                        ),
                      ),
                      const SizedBox(height: 10),
                      Slider(
                        value: _sliderValue,
                        onChanged: _updateSliderValue,
                      ),
                      Text(
                        '当前值: ${(_sliderValue * 100).toStringAsFixed(0)}%',
                        style: const TextStyle(fontSize: 16),
                      ),
                    ],
                  ),
                ),
              ),
            ],
          ),
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _incrementCounter,
        tooltip: '增加',
        child: const Icon(Icons.add),
      ),
    );
  }
}